<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Tam - Creative Portfolio Template</title>
	<meta name="description" content="Tam - Creative Portfolio Template" />
	<meta name="keywords" content="blog, business card, creative, creative portfolio, cv theme, online resume, personal, portfolio, professional cv, responsive portfolio, resume, resume theme, vcard" />
	<meta name="author" content="beingeorge" />
	<meta name="theme-color" content="#2a2d35">

	<!-- Vendor Css-->
	<link rel="stylesheet" href="assets/css/vendor.css" />	
	<link rel="stylesheet" href="assets/css/LineIcons.min.css" />	
	
	<!-- TamTemplate style Css -->
	<link href="assets/css/tam.css" rel="stylesheet">

	<!-- Custom style Css -->
	<link href="assets/css/custom.css" rel="stylesheet">
</head>

<body data-spy="scroll" data-target=".navbar">

	<!-- START: Preloader -->
	<div id="preloader" class="preloader">
		<div class="spinner-grow text-dark" role="status">
			<span class="sr-only">Loading...</span>
		</div>
	</div>
	<!-- END: Preloader -->

	<!-- START: Aside -->
	<aside class="aside">
		<!-- START: NAVBAR -->

		<div class="nav-wrapper">

			<div class="navbar-toggler">
				<svg class="ham hamRotate ham1" viewBox="0 0 100 100" width="60">
				  <path class="line top" d="m 30,33 h 40 c 0,0 9.044436,-0.654587 9.044436,-8.508902 0,-7.854315 -8.024349,-11.958003 -14.89975,-10.85914 -6.875401,1.098863 -13.637059,4.171617 -13.637059,16.368042 v 40" />
				  <path class="line middle" d="m 30,50 h 40" />
				  <path class="line bottom" d="m 30,67 h 40 c 12.796276,0 15.357889,-11.717785 15.357889,-26.851538 0,-15.133752 -4.786586,-27.274118 -16.667516,-27.274118 -11.88093,0 -18.499247,6.994427 -18.435284,17.125656 l 0.252538,40" />
				</svg>
			</div>

			<nav class="navbar text-center align-items-center justify-content-center">



                <div class="collapse navbar-collapse show" id="navbarCollapse">
                	<div class="about-avatar mb-5">
                		<a href="index.html">
							<img src="assets/images/about.jpg" alt="" class="img-fluid mx-auto d-block shadow-sm rounded-full">
						</a>

						<div class="about-avatar-details mt-4">
							<h1>郑丽娜</h1>
							<p class="badge">前端工程师</p>
						</div>

					</div>
                    <ul class="navbar-nav mx-auto">
						<li class="nav-item">
                            <a class="nav-link" href="index.html"><i class="lni-home"></i>个人介绍</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="resume.html"><i class="lni-briefcase"></i>自身情况</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="work.html"><i class="lni-graduation"></i>作品集</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="services.html"><i class="lni-offer"></i>我的技能</a>
                        </li>
                     
                        <li class="nav-item active">
                            <a class="nav-link" href="contact.html"><i class="lni-phone-handset"></i>联系方式</a>
                        </li>
                    </ul>
                </div>

               	<div class="aside-footer">
                	<ul class="list-unstyled list-inline">
                        <li class="list-inline-item"><a href="#"><i class="lni-facebook-filled"></i></a></li>
                        <li class="list-inline-item"><a href="#"><i class="lni-skype"></i></i></a></li>
                        <li class="list-inline-item"><a href="#"><i class="lni-youtube"></i></a></li>
                        <li class="list-inline-item"><a href="#"><i class="lni-linkedin-original"></i></a></li>
                    </ul>
                </div>
	        </nav>
        </div>
        <!-- END: NAVBAR -->
    </aside>
    <!-- START: Aside -->

    <div class="page-overlay">
    	<span class="overlay-1"></span>
    	<span class="overlay-2"></span>
    </div>

    <div class="page-wrapper">

		<!-- START: HOME -->		
    	<section class="section-home " id="home">
    		<div class="glass">郑丽娜</div>
    		<!-- <img src="assets/images/banner.jpg" /> -->
    	</section>	
    	<!-- END: HOME -->

		<!-- START: ABOUT -->
		<section class="section section-about" id="about">
			<div class="container">
				<div class="section-head">
					<span>认识</span>
					<h2>关于我</h2>
				</div>

				<div class="row justify-content-center align-items-center">
					<div class="col-md-6">
						<img class="about-img img-fluid wow fadeInUp" data-wow-duration="1s" src="assets/images/avatar.jpg" alt="About Picture">
					</div>
					<div class="col-md-6">
						<div class="about-desc wow fadeInUp" data-wow-duration="1s"  data-wow-delay="500ms">
							<div class="about-desc-content">
								<h1 class="font-weight-light mb-5">我是郑丽娜</h1>
							
							</div>

							<div class="about-desc-more text-left mt-5">
								<div class="row">
									<div class="col-md-6">
										<div class="about-desc-info">
											<b>年龄: </b>
											<span>18</span>
										</div>
									</div>
									<div class="col-md-6">
										<div class="about-desc-info">
											<b>位置： </b>
											<span>河南</span>
										</div>
									</div>
									<div class="col-md-6">
										<div class="about-desc-info">
											<b>学位: </b>
											<span>主</span>
										</div>
									</div>
									<!-- <div class="col-md-6">
										<div class="about-desc-info">
											<b>Skype : </b>
											<a href="tel:beingeorge">beingeorge</a>
										</div>
									</div> -->
									<div class="col-md-6">
										<div class="about-desc-info">
											<b>电话: </b>
											<a href="tel:0987654321">13932084652</a>
										</div>
									</div>
									<div class="col-md-6">
										<div class="about-desc-info">
											<b>电子邮件:</b>
											<a href="mailto:hello@beingeorge.com">2214412717@qq.com</a>
										</div>
									</div>
									
								</div>
							</div>
						</div>
					</div>

				</div>
			</div>

			<div class="container mt-5 pt-3">
				<div class="section-head ">
					<span>能力</span>
					<h2>我的技能</h2>
				</div>

				<div class="section-skills-wrap">
					<div class="row">
						<!-- <div class="col-md-6">
							<p>Proin laoreet elementum ligula, ac tincidunt lorem accumsan nec. Fusce eget urna ante. Donec massa velit, varius a accumsan ac, tempor iaculis massa. Sed placerat justo sed libero varius vulputate. Ut a mi tempus massa malesuada fermentum.</p>
							<p> tempor iaculis massa. Sed placerat justo sed libero varius vulputate. Ut a mi tempus massa malesuada fermentum.</p>
						</div> -->

						<div class="col-md-6">
							<div class="resume-panel">
								<div class="mb-4 wow fadeInUp"  data-wow-duration="1.5s">
									<h6>精通HTML/XHTMLCSS,熟悉页面架构和布局</h6>
									<div class="progress mt-2">
										<div class="progress-bar" role="progressbar" style="width: 95%;" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100"></div>
									</div>
								</div>

								<div class="mb-4 wow fadeInUp"  data-wow-duration="1.5s" data-wow-delay=".2s">
									<h6>精通Ajax、JavaScript</h6>
									<div class="progress mt-2">
										<div class="progress-bar" role="progressbar" style="width: 75%;" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
									</div>
								</div>

								<div class="mb-4 wow fadeInUp"  data-wow-duration="1.5s" data-wow-delay=".3s">
									<h6>vue以及ps
									</h6>
									<div class="progress mt-2">
										<div class="progress-bar" role="progressbar" style="width: 85%;" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100"></div>
									</div>
								</div>

								<!-- <div class="mb-0 wow fadeInUp"  data-wow-duration="1.5s" data-wow-delay=".4s">
									<h6>Photoshop & Figma</h6>
									<div class="progress mt-2">
										<div class="progress-bar" role="progressbar" style="width: 80%;" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
									</div>
								</div> -->

							</div>
						</div>	
					</div>
				</div>
			</div>
		</section>
		<!-- END: ABOUT -->

	
		<!-- <section class="section section-dark section-services" id="services">
			<div class="container">
				<div class="section-head">
					<span>WHAT I DO</span>
					<h2>My Services</h2>
				</div>

				<div class="row mt-4">
					<div class="col-sm-6 col-lg-6">
						<div class="services-list b-box hover-state p-4 mt-4 wow fadeInUp" data-wow-duration="1.5s">
							<div class="services-list-icon">
								<i class="lni-color-pallet"></i>
								<span>01</span>
							</div>
							<div class="mt-4">
								<h5 class="mb-0">Graphic Design</h5>
								<p class=" mt-3">Modern and mobile-ready website that will help of your marketing. Proin laoreet elementum ligula, ac tincidunt lorem accumsan nec.</p>
							</div>
						</div>
					</div>
					<div class="col-sm-6 col-lg-6">
						<div class="services-list b-box hover-state p-4 mt-4 wow fadeInUp" data-wow-duration="1.5s" data-wow-delay=".2s">
							<div class="services-list-icon">
								<i class="lni-laptop-phone"></i>
								<span>02</span>
							</div>
							<div class="mt-4">
								<h5 class="mb-0">Web Development</h5>
								<p class=" mt-3">Modern and mobile-ready website that will help of your marketing. Proin laoreet elementum ligula, ac tincidunt lorem accumsan nec.</p>
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-lg-12 text-center mt-5 wow fadeInUp" data-wow-duration="1.5s" data-wow-delay=".5s">
						<a href="services.html" class="btn hover-state">View All</a>
					</div>
				</div>
			</div>
		</section> -->
		<!-- END: SERVICES -->


		<!--START: FOOTER-->
		<!-- <footer class="footer section section-light">
			<div class="container">
				<p class="copyright text-center mb-0">&copy; Tam 2020 | All Right Reserved 更多模板：<a href="http://www.mycodes.net/" target="_blank">源码之家</a></p>
			</div>
		</footer> -->
		<!--END: FOOTER-->
	</div>


	<!-- JAVASCRIPTS -->

	<script src="assets/js/vendor.js"></script>

	<!-- Map -->
	<script src="assets/js/map.js"></script>
	<script src="https://ditu.google.cn/maps/api/js?key=AIzaSyD79MY72taVRlZVX2DU6L5PXOh3ezUUKMc&amp;callback=initMap" async="" defer=""></script>
	
	<!-- Custom Js -->
	<script src="assets/js/custom.js"></script>
</body>
</html>
